<ui:component xmlns:ui="http://java.sun.com/jsf/facelets"
              xmlns:h="http://java.sun.com/jsf/html"
              xmlns:f="http://java.sun.com/jsf/core"
              xmlns:c="http://java.sun.com/jstl/core"
              xmlns:rich="http://richfaces.org/rich"
              xmlns:a4j="http://richfaces.org/a4j"
              xmlns:msn="http://www.contact.messanger.com/contacts/msn/ui"
        >

        <script type="text/javascript" language="JavaScript">
        //<![CDATA[
            var selectedTab = null;
        //]]>
        </script>

        <rich:tabPanel id="chatTabs" switchType="ajax" height="100%" width="100%">

            <c:forEach var="chatRoom" items="#{chatSessionBean.openChatRooms}" varStatus="i">

                <rich:tab id="room_#{chatRoom.uniqueKey}"
                          rendered="#{chatRoom ne null}"
                          ontabenter="selectedTab = 'room_#{chatRoom.uniqueKey}';setViewingRoom('#{i.index}');"
                        >
                    
                    <f:facet name="label">
                        <h:panelGroup>

                            <h:outputText value="#{chatRoom.chatTopic}" style="text-align:left"/>
                            <rich:spacer width="20" height="10" title="|"/>
                            <h:graphicImage value="./style/images/closeTab.png" style="cursor:pointer"
                                            styleClass="hidelink"
                                            onclick="deleteTab('#{chatRoom.uniqueKey}');Event.stop(event);"/>

                        </h:panelGroup>
                    </f:facet>

                    <h:panelGroup style="min-height:300px; max-height:100%;" layout="block">
                        <a4j:form id="form_openChatRoom#{i.index}">
                            <ui:include src="chatWindow.xhtml">
                                <ui:param name="chatRoom" value="#{chatRoom}"/>
                                <ui:param name="height" value="400px"/>
                            </ui:include>
                        </a4j:form>
                    </h:panelGroup>


                </rich:tab>

            </c:forEach>

        </rich:tabPanel>

        <h:form>
            <a4j:jsFunction reRender="chatTabs, form_chatList, form_chatUserList" name="deleteTab" action="#{chatRequestBean.closeRoom}">
                <a4j:actionparam name="roomKey" assignTo="#{chatRequestBean.roomKey}"/>
            </a4j:jsFunction>
            <a4j:jsFunction reRender="form_chatUserList" name="setViewingRoom">
                <a4j:actionparam name="index" assignTo="#{chatSessionBean.viewingIndex}"/>
            </a4j:jsFunction>
        </h:form>
    
</ui:component>